﻿@model Coevery.Fields.Settings.DatetimeFieldSettings
@using Coevery.Fields.Settings;

<section class="control-group data-row">
    <label class="control-label">
        Default Value
    </label>
    <div class="controls input-prepend errortips">
        <span class="add-on">
            <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
        </span>
        @Html.TextBoxFor(d => d.DefaultValue, new { @class = "date", id = "datetimeDefault", name = "datetimeDefault" })
    </div>
    <script>
        function convertDatetime(dateStr) {
            if (dateStr) {
                var tempDate = new Date(dateStr);
                return (tempDate.getMonth() + 1).toString() + '/' + tempDate.getDate() + '/' + tempDate.getFullYear() + ' ' +
                    tempDate.getHours() % 12 + ':' + tempDate.getMinutes() + ((tempDate.getHours() < 12) ? " AM" : " PM");
            } else {
                return "";
            }
        }

        $(document).ready(function () {
            var defaultDatetime = $("#datetimeDefault");
            if (defaultDatetime.length != 0) {
                defaultDatetime.attr("data-format", "MM/dd/yyyy HH:mm PP");
                defaultDatetime.parent().datetimepicker({
                    pick12HourFormat: true,
                    pickSeconds: false,
                });
                defaultDatetime.val(convertDatetime(defaultDatetime.val()));
            }


            $(".add-on").click(function () {
                setTimeout(function () {
                    $(".bootstrap-datetimepicker-widget").offset(function (index, coords) {
                        var result = { top: 0, left: 0 };
                        result.left = coords.left;
                        result.top = $(".input-prepend").offset().top -
                                $(".bootstrap-datetimepicker-widget").outerHeight(true) - 4;
                        return result;
                    });
                }, 0);
            });
        });
    </script>
</section>
